<template>
  <div class="modal fade" v-bind:id="id" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
      <div class="modal-dialog">
          <div class="modal-content">
              <div class="modal-header">
                  <h5 class="modal-title" id="staticBackdropLabel">{{title}}</h5>
                  <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
              </div>
              <div class="modal-body">
                  {{msg}}
              </div>
              <div class="modal-footer">
                  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                  <button @click="$emit('confirm')" type="button" class="btn btn-primary" data-bs-dismiss="modal">{{yes}}</button>
              </div>
          </div>
      </div>
  </div>
</template>

<script>
  export default {
    name: 'ConfirmDialog',
    props: ['id', 'title', 'msg', 'yes'],
    data() {
      return {
      }
    }
  }
</script>

<style>
</style>
